html,body,p,div,h1,h2,h3,h4,h5,h6,img,a,input,textarea,b,strong,ul,li,ol,dl,dt,dd,i{ font-size:13px; margin:0; padding:0; font-family:Microsoft YaHei,'Microsoft YaHei',Arial;}
h1,h2,h3,h4,h5,h6{ font-weight:bold;}
img,a{ border:none;}
ul,li,ol{ list-style:none; }
body{ width:100%; height:100%; font-family:Microsoft YaHei,'Microsoft YaHei',Arial; background:#ffffff; overflow:hidden; overflow-y:scroll;}

/* element */
em{ animation:em infinite 1s linear; -webkit-animation:em infinite 1s linear;}
@keyframes em{50%{ transform:scale(1.2);}}
@-webkit-keyframes em{50%{ -webkit-transform:scale(1.2);}}
em{ font-style:normal; margin-left:6px;}

/* link */
a{ color:#ff0000; text-decoration:none;}
a:link,a:active{ color:#ff0000;}
a:hover{ color:#ff0000; text-decoration:underline;}


.tc{ text-align:center;}
.tl{ text-align:left;}
.tr{ text-align:right;}
img.left{ float:left; margin-top:5px; margin-right:5px;}
img.right{ float:right; margin-top:5px; margin-left:5px;}

/* public */
.transLeft,.pic,.text,.txt,img{transition: all 0.5s; -webkit-transition: all 0.5s;}

.imghover{ overflow:hidden;}
.imghover img:hover{ transform: scale(1.2) ;-webkit-transform: scale(1.2) ;-ms-transform: scale(1.2) ;-o-transform: scale(1.2) ;-moz-transform: scale(1.2) ; opacity:.7; }

.transLeft{ transform:translateX(-999px); -webkit-transform:translateX(-999px); opacity:0; }
.transRight{ transform:translateX(1999px); -webkit-transform:translateX(1999px); opacity:0; }
.transTop{ transform:translateY(500px); -webkit-transform:translateY(500px); opacity:0; }
.transBottom{ transform:translateY(500px); -webkit-transform:translateY(500px); opacity:0; }

.rotatex90{ transform:rotateX(90deg); -webkit-transform:rotateX(90deg); opacity:0;}
.rotatex180{ transform:rotateX(180deg); -webkit-transform:rotateX(180deg);  opacity:0;}

.leftToRight{ transform:translateX(-999px) rotate(-360deg) scale(2); -webkit-transform:translateX(-999px) rotate(-360deg) scale(2); opacity:0;}
.rightToLeft{ transform:translateX(999px) rotate(-360deg) scale(2); -webkit-transform:translateX(999px) rotate(-360deg) scale(2); opacity:0;}
.scaleY{transform:translateY(100px) scale(3) rotateX(-120deg); -webkit-transform:translateY(100px) scale(3) rotateX(-120deg);  opacity:0;}

/* start */

#Content,.middle,#Nav{ width:1200px; margin:0 auto;}
.clearfix:after,.wrapper:after {visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
.clearfix {display:inline-block}
.clear{ clear:both; height:0; font:0/0 arial;}

.position{ height:40px; line-height:40px; background:#f5f5f5; color:#333333;}
.position .name{ width:1200px; margin:0 auto; padding-left:25px; background:url(../images/contact.gif) 0 10px no-repeat;}
.position a{ color:#333333;}
.position em{ color:#ff0000;}

/* topbar */
.topbar{  position:relative; z-index:999; height:40px; line-height:40px; word-spacing:6px; color:#dfdfdf; background:#fafafa; border-bottom:1px solid #dfdfdf;}
.topbar .rightside{ float:right;}
.topbar .leftside{ float:left;}
.topbar a,.topbar span{ color:#666666;}
.topbar em{ color:#fe0000;}
.topbar .select{ position:relative; z-index:999;}
.topbar .select .name{ position:relative; z-index:999; display:inline-block; height:40px; line-height:40px; padding:0 10px; cursor:pointer;}
.topbar .select .list{transition: all 0.5s; -webkit-transition: all 0.5s; display:none; position:absolute; left:0; top:30px; width:250px; border:1px solid #dfdfdf; border-top:none; padding:10px; background:#ffffff; overflow:hidden;}
.topbar .select.current .name{ padding:0 9px; border-left:1px solid #dfdfdf; border-right:1px solid #dfdfdf; background:#ffffff;}
.topbar .select.current .list{ display:block; line-height:25px; }
.topbar .select.current .list a{ display:inline-block; height:22px; line-height:22px;}
.topbar .select .line{ display:none; position:absolute; left:0; bottom:-1px; width:100%; height:2px; font:0/0 arial; background:#ffffff;}
.topbar .select.current .line{ display:block; }

/* nav */
#Nav{ position:relative; z-index:5; height:150px;}
#Nav .logo{ display:block; float:left; width:356px; height:108px; margin-top:21px; background: url(../yqcl/images/logo_02.png) no-repeat center center; background-size:356px 80px; }
#Nav ul{ float:right; padding-top:55px;}
#Nav li{ float:left; display:inline; position:relative; z-index:1; height:46px; line-height:23px; padding:0 15px; font-size:16px; color:#686161; text-align:center; font-family:Microsoft YaHei,Arial;}
#Nav li .i-host{ position:absolute; right:15px; top:-20px; width:30px; height:18px; background:url(../images/host.gif) no-repeat;}
#Nav li a{ display:block; color:#686161; font-size:16px;}
#Nav li p{ color:#404040; font-size:12px; }
#Nav li a:hover,#Nav li a:hover p{ text-decoration:none; color:#fe0000;}
#Nav li.current a,#Nav li.current p{ color:#fe0000;}

.nav-list{ position:absolute; display:none; left:100px; top:103px; width:200px; height:110px; opacity:0; padding:5px; border:1px solid #fe0000; background:#ffffff; -webkit-transition-duration:.3s; -moz-transition-duration:.3s; -o-transition-duration:.3s;  -ms-transition-duration:.3s; }
.nav-list .cnt{ height:100px; overflow:hidden;}
.nav-list a{ display:block; height:34px; line-height:34px; text-align:center; border-bottom:1px solid #f1f1f1; color:#333333; }
.nav-list a:hover{ color:#ff0000;}
.nav-list .i-jian{ position:absolute; left:50%; top:-8px; width:10px; height:8px; margin-left:-5px; font:0/0 arial; background:url(../images/icon.png) no-repeat; }
.nav-list .list{ display:none; opacity:0; overflow:hidden; -webkit-transition-duration:.3s; -moz-transition-duration:.3s; -o-transition-duration:.3s;  -ms-transition-duration:.3s; }

/* .brand  */
.brand .title{  height:50px; font-size:40px; color:#ff0000; }
.brand .content{ padding:20px 0; }
.brand .img-list{ overflow:hidden; }
.brand .img-list ul{ float:left; width:1305px;}
.brand .img-list li{ float:left; width:325px; margin-right:110px; color:#666666;}
.brand .see{ height:20px;}
.brand .see span{ display:block; width:70px; height:20px; line-height:20px; color:#ffffff; background:#ff0900; text-align:center;}
.brand .img{ width:325px; height:100px; margin-bottom:5px; overflow:hidden;}
.brand .img img{transition: all 0.5s; width:325px; height:100px;}
.brand li p{ line-height:22px;}
.brand li .aside{ text-align:right; color:#da251e;}
.brand .logo-list{ float:left; width:99999em; overflow:hidden; }
.brand .logo-list li .pic{ transition: all 0.5s; height:120px; display:-webkit-box; -webkit-box-pack:center; -webkit-box-align:center; }

.brand-logo{ padding-top:30px; overflow:hidden; }
.brand-logo ul{ float:left; overflow:hidden;}
.brand-logo li{ float:left; display:inline; width:171px; text-align:center;}
.brand-logo li img{transition: all 0.5s; -webkit-transition: all 0.5s; display:block; margin:0 auto; max-width:160px; max-height:90px;}
.brand-logo li .pic:hover img,.product .img-list a:hover img,.brand .img:hover img{ transform: scale(1.2) ;-ms-transform: scale(1.2) ;-webkit-transform: scale(1.2) ;-o-transform: scale(1.2) ;-moz-transform: scale(1.2) ; opacity:.7; }
.brand .edit ul,.tech .edit ul{ padding:10px 0 30px; *width:100px; *margin:0 auto; text-align:center; }
.brand .edit li,.tech .edit li{ display:inline-block; _display:inline; *float:left; width:9px; height:9px; font:0/0 arial; margin-right:10px; cursor:pointer; font:0/0 arial; background:url(../images/dian.png) -10px 0 no-repeat; _background:url(../images/dian.png) -10px 0 no-repeat;}
.brand .edit li.current,.tech .edit li.current{ background-position:0 0;}

/* contact */
.contact{ padding:135px 0 10px; overflow:hidden; background:url(../images/contact-bg.jpg) center 0 no-repeat;}
.contact h2{ padding-left:5px; height:30px; line-height:30px; font-size:30px; color:#ff0900; border-left:3px solid #ff0900; }
.contact h2 span{ font-size:20px; font-weight:normal; color:#a5a5a5; }
.contact .logo{ height:20px; margin:30px 0; }
.contact .leftside{ float:left; width:400px;}
.contact .weixin{ float:left; width:130px; padding-top:110px; text-align:center;}
.contact .weixin .img{ width:120px; height:127px; background: url(../images/brand/weixin.png) no-repeat; background-size:120px 127px;}
.contact .leftside li{ height:20px; line-height:20px; margin-bottom:15px; padding-left:25px; color:#666666; background:url(../images/contact.gif) no-repeat;}
.contact .leftside li.tel{ background-position: 0 -31px;}
.contact .leftside li.email{ background-position: 0 -55px;}

.contact .rightside{ float:right; width:560px;}
.contact .form{ padding-top:35px; overflow:hidden;}
.contact .form ul{ margin-bottom:20px; overflow:hidden;}
.contact .form ul li{ float:left; width:275px; position:relative; z-index:1;}
.contact .form ul li i{ position:absolute;left:8px; top:11px; background:url(../images/contact.gif) no-repeat;}
.contact .form ul li .i-qq{ width:15px; height:15px; background-position:0 -83px;}
.contact .form ul li .i-conpany{ *left:13px; width:15px; height:15px; background-position:0 -108px;}
.contact .form ul li .i-tel{ width:15px; height:20px; background-position:0 -31px;}
.contact .form ul li .i-yanzhen{ top:13px; *left:13px; width:15px; height:15px; background-position:0 -133px;}
.contact .form ul li input{  width:230px; padding:4px; height:30px; line-height:30px; padding-left:35px; border:1px solid #d8d8d8; }
.contact .form ul li.left{ margin-right:5px;}
.contact .form ul li.right{ margin-left:5px;}
.contact .text textarea{ width:548px; height:66px; margin-bottom:20px; padding:5px; border:1px solid #d8d8d8; overflow:hidden;}
.contact .submit .btn{ float:right; width:130px; height:40px; line-height:40px; background:#ff0900; text-align:center; color:#fff; font-size:14px; cursor:pointer; border:none;}

/* pop */
.pop{ position:fixed; z-index:9999; left:0; top:0; right:0; bottom:0; width:100%; height:100%;}
.pop-box{position:relative; z-index:99999; -webkit-perspective:600px; width:100%; height:100%; display:box; box-align:center; box-pack:center; display:-webkit-box; -webkit-box-align:center; -webkit-box-pack:center;-moz-box-align:center; -moz-box-pack:center; display:-moz-box;display:-o-box; -o-box-align:center; -o-box-pack:center; }
.pop .popbg{ transition-duration:.5s; -webkit-transition-duration:.5s; position:absolute; left:0; top:0; width:100%; height:100%; background:#000000; opacity:0; filter:alpha(opacity=30);}
.pop .pop-content{  width:80%; border:5px solid #595959; border:5px solid rgba(0,0,0,.5); margin:0 auto; background:#ffffff;
	transition-duration:.5s; -webkit-transition-duration:.5s; transform:rotateY(180deg) scale(.1); opacity:0;
	-webkit-transform:rotateY(180deg) scale(.1);
	 -moz-transform:rotateY(180deg) scale(.1);
	-ms-transform:rotateY(180deg) scale(.1);
	-o-transform:rotateY(180deg) scale(.1);
}
.pop .title{position:relative; z-index:99999; height:40px; line-height:40px; padding: 0 10px; background:#f1f1f1;}
.pop .content{ background:#ffffff; margin:10px; padding:10px; line-height:22px; overflow:hidden;overflow-y:auto;}
.pop .close{ transition-duration:.3s; -webkit-transition-duration:.3s; position:absolute; right:-15px; top:-15px; display:block; width:30px; height:30px; border-radius:100%; font:0/0 arial; background:#000;}
.pop .close .h-line,.pop .close .v-line{ position:absolute; left:20%; width:60%; height:1px; top:49.5%; background:#fff; }
.pop .close .h-line{transform:rotate(45deg); -webkit-transform:rotate(45deg);}
.pop .close .v-line{transform:rotate(-45deg); -webkit-transform:rotate(-45deg);}
.pop .close:hover{ background:#e80000;}

/* footer */
.footer-info{ clear:both;}
#Footer{ clear:both; border-top:10px solid #ff0900; background:#2b2828; color:#dadada; overflow:hidden;}
#Footer a{ color:#dadada;}
#Footer .navbar{ padding:60px 0 20px; background:#353535;  overflow:hidden; }
#Footer .navbar dl{ float:left; width:350px; margin-left:75px; line-height:22px;  overflow:hidden; }
#Footer .navbar dl.first{ margin-left:0;}
#Footer .navbar dt{ height:30px; margin-bottom:15px; border-bottom:1px solid #848484; font-size:15px; font-weight:bold; color:#ffffff; }
#Footer .navbar ul{ padding-bottom:10px; overflow:hidden;}
#Footer .navbar li .text{ float:left; height:22px; line-height:22px; width:240px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; word-break:break-all;}
#Footer .navbar li span{ float:right; width:85px; text-align:right;}
#Footer .navbar .more{ float:left; display:block; width:150px; height:28px; line-height:28px; border:1px solid #868686; color:#da251e; text-align:center; font-size:14px; font-family:articl;}
#Footer .navbar .more:hover{ text-decoration:none; color:#fff; background:#ce2620;}
#Footer .copyright{ padding:25px 0; text-align:center; line-height:20px;}